<template>
  <div>
    <form>
      <label>姓名：</label>
      <input type="text" v-model="name" />
      <br />
      <br />

      <label>年龄：</label>
      <input type="number" v-model="year" />
      <br />
      <br />

      <label>身高：</label>
      <input type="number" v-model="height" :step="0.01" />(米)
      <br />
      <br />

      <label>体重：</label>
      <input type="number" v-model="weight" />(公斤)
      <br />
      <br />

      <label>病史：</label>
      <input type="text" v-model="happy" />
      <br />
      <br />

      <button @click.prevent="diagNose">诊断</button>
    </form>

    <p>患者 的诊断结果：</p>

    <p v-if="arr < 18 ">偏瘦</p>
    <p v-else-if="arr >18.5 && arr<24.9">合格</p>
    <p v-else-if="arr >25 && arr<30">轻度肥胖</p>
    <p v-else-if="arr >30 && arr<35">中度肥胖</p>
    <p v-else-if="arr >35">重度肥胖</p>
    <p v-else>超重</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      name: '',
      year: 0,
      height: 0,
      weight: 0,
      happy: '',
      arr: '',
    }
  },
  methods: {
    diagNose() {
      this.arr = (this.weight / this.height) ^ 2
    },
  },
}
</script>
